<template>
    <div>
        房型:
        <select v-model="tj.typeid">
            <option value="0">请选择</option>
            <option v-for="q in paii" :value="q.houseTypeId">{{ q.houseTypeName }}</option>
        </select>
        房号:
        <select v-model="tj.numid">
            <option value="0">请选择</option>
            <option v-for="w in pai" :value="w.houseNumId">{{ w.houseNumName }}</option>
        </select>
        <input type="button" value="查询" @click="c">
        <input type="button" value="重置" @click="cc">
        <table>
            <thead>
                <tr>
                    <td>编号</td>
                    <td>名称</td>
                    <td>房间类型</td>
                    <td>房号</td>
                    <td>入住时间</td>
                    <td>操作</td>
                </tr>
            </thead>
            <tbody>
                <tr v-for="a in date">
                    <td>{{ a.houseId }}</td>
                    <td>{{ a.houseName }}</td>
                    <td>{{ a.houseTypeName }}</td>
                    <td>{{ a.houseNumName }}</td>
                    <td>{{ moment(a.dates).format("YYYY-MM-DD") }}</td>
                    <td>
                        <input type="button" value="修改" @click="Upd(a.houseId)">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import { ref,onMounted } from 'vue';
import moment from 'moment';
import { useRouter } from 'vue-router';
import axios from 'axios';
const routher = useRouter();
onMounted(()=>{
    leixing()
    leixings()
    show()
})
const c=()=>{
    show();
}
const cc=()=>{
    tj.value={
        typeid:0,
        numid:0
    }
    show()
}
const Upd=(val:any)=>{
    routher.push({path:"/Update",query:{id:val}})
}

const tj=ref({
    typeid:0,
    numid:0
})
const show=()=>{
    axios.get("https://localhost:7144/api/House/show",{params:tj.value}).then(res=>{
        date.value=res.data;
    })
}

const date=ref([{
    "houseTypeId": 0,
    "houseId": 0,
    "houseNumId": 0,
    "houseName": "",
    "dates": "",
    "houseNumName": "",
    "houseTypeName": ""
}])
//房好数量
const leixing=()=>{
    axios.get("https://localhost:7144/api/HouseNum/GetHouseNums").then(res=>{
        pai.value=res.data;
    })
}
const pai=ref([{
    "houseNumId": 0,
    "houseNumName": ""
}])
//房型类型
const leixings=()=>{
    axios.get("https://localhost:7144/api/HouseType/GetHouseTypes").then(res=>{
        paii.value=res.data;
    })
}
const paii=ref([{
    "houseTypeId": 0,
    "houseTypeName": ""
}])
</script>

<style scoped>

</style>